<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="vue.js"></script>
<style type="text/css">
    .divl{
        width: 100px;
        height: 100px;
        background: red;
        margin-top: 20px;
    }
    button{
        padding:10px 25px;
        border: none;
        background-color: green;
        color: #fff;
        border-radius: 5px;
    }
</style>
<div id="app">
    <button v-on:clike='fn'>toggle</button>
    <!-- v-on:可以简写成@ -->
    <div class="div1" v-show='bol'></div>
</div>
<script type="text/javascript">
    var vm =new Vue({
        el: '#app',
        data:{
            bol:false
        },
        methods:{
            fn:function(){
                this.bol=!this.bol;
            }
        }
    })
</script>
<body>

</body>
</html>